<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div class="box">诗1</div>
    <div class="box">诗2</div>
    <div id="nav">
        <ul>
            <li>弃我去者</li>
            <li>昨日之日不可留</li>
            <li>乱我心者</li>
            <li>今日之日多烦忧</li>
        </ul>
    </div>
    
    <script>
        //1.getElementByClassName  根据类名获得某些元素集合
        let boxs = document.getElementsByClassName('box');
        console.log(boxs);


        //2. 返回符合条件的第一个元素
        console.log(document.querySelector('#nav'));//id
        console.log(document.querySelector('.box'));//类名
        console.log(document.querySelector('li'));//标签


        //3.返回函数
        console.log(document.quertSelector('li'));

    </script>
</body>
</html>